<template>
  <div class="dashboard-container">
    <div class="app-container">
      <PageTools>
        <template #after>
          <el-button size="small" type="primary" @click="addPermission('0',1)">新增权限</el-button>
        </template>
      </PageTools>

      <el-table :data="list" border style="width: 100%;margin-top: 20px" row-key="id">
        <el-table-column prop="name" label="名称"/>
        <el-table-column prop="code" label="标识"/>
        <el-table-column prop="description" label="描述"/>
        <el-table-column
          label="操作"
          align="center"
          width="300px">
          <template slot-scope="{row}">
            <el-button type="text" size="small" v-if="row.type===1" @click="addPermission(row.id,2)">添加</el-button>
            <el-button type="text" size="small" @click="editPermission(row.id)">编辑</el-button>
            <el-button type="text" size="small" @click="delPermission(row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

      <add-permission ref="addPermission" :show-dialog.sync="showDialog" :type="type" :pid="pid"/>

    </div>
  </div>
</template>

<script>
  import {delPermission, getPermissionList} from "@/api/permission";
  import {transListToTreeData} from "@/utils";
  import AddPermission from "@/views/permission/components/add-permission";

  export default {
    components: {AddPermission},
    data() {
      return {
        list: [],
        showDialog: false,
        pid: '',
        type: ''
      }
    },
    created() {
      this.getPermissionList()
    },
    methods: {
      async getPermissionList() {
        const data = await getPermissionList()
        this.list = transListToTreeData(data, '0')
      },
      //删除权限
      delPermission(id) {
        this.$confirm('确定删除改权限?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          return delPermission(id)
        }).then(() => {
          this.$message.success('删除成功!');
          this.getPermissionList()
        }).catch(() => {

        });
      },
      //添加权限
      addPermission(pid, type) {
        this.pid = pid
        this.type = type
        this.showDialog = true
      },
      async editPermission(id) {
        await this.$refs.addPermission.editPermission(id)
        this.showDialog = true
      }
    }
  }
</script>

<style scoped>

</style>
